<template>
	<view class="container">
		<view class="record_top">
			<view class="left">
				<text>会员姓名：某某某</text>
				<text>联系电话：18 6688 9988</text>
				<text>已购套餐：198元会员 套餐</text>
				<text>购买时间：2023-1-28 12:25:35</text>
				<text>剩余取液次数：48次</text>
			</view>
			<view class="right">
				<image src="../../../static/image/shop/10-1.png" mode=""></image>
			</view>
		</view>

		<view class="recordtable" v-for="(item,index) in record" :key="index">
			<view class="time">
				{{item.time}}
			</view>
			<view class="status">
				{{ item.status }}
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				record: [{
					time: '2023-04-15 14:27:35',
					status: '正常取液'
				},{
					time: '2023-04-15 14:27:35',
					status: '正常取液'
				},{
					time: '2023-04-15 14:27:35',
					status: '正常取液'
				},{
					time: '2023-04-15 14:27:35',
					status: '正常取液'
				},{
					time: '2023-04-15 14:27:35',
					status: '正常取液'
				},{
					time: '2023-04-15 14:27:35',
					status: '正常取液'
				},]
			}
		},
	}
</script>

<style scoped lang="scss">
	@import '@/common/sass/all/all.scss';

	.record_top {
		display: flex;
		justify-content: space-around;
		align-items: center;
		width: 684rpx;
		height: 213rpx;
		border-radius: 25rpx;
		margin-top: 40rpx;
		background: linear-gradient(to right, rgba(254, 255, 255, 1), rgba(167, 255, 255, 1));

		.left {
			display: flex;
			flex-direction: column;
			justify-content: center;
			font-size: 22rpx;
			font-weight: 400;
			color: #3E3A39;
			line-height: 34rpx;
		}

		.right {
			width: 101rpx;
			height: 143rpx;

			image {
				width: 101rpx;
				height: 143rpx;

			}
		}
	}

	.recordtable {
		width: 684rpx;
		height: 105rpx;
		background: #ffffff;
		border-radius: 25rpx;
		margin-top: 18rpx;
		display: flex;
		justify-content: space-around;
		align-items: center;

		.time {
			font-size: 27rpx;
			font-weight: 300;
			color: #727171;
			line-height: 50rpx;
		}

		.status {
			font-size: 27rpx;
			font-weight: 300;
			line-height: 50rpx;
		}
	}
</style>